<template>
  <header class="page-tools-wrapper">
    <el-switch
      v-model="isShowSubmit"
      active-color="#13ce66"
      inactive-color="#0094ff"
      :active-text="$t('EXCEL.ShowSubmitData')"
      :inactive-text="$t('EXCEL.ShowOriginData')"
    />
    <el-radio-group class="submit-type" :value="isSubmitAll">
      <el-radio :label="false" @change="handleIsSubmitAllChange(false)">
        {{ $t("EXCEL.ExportInNeed") }}
      </el-radio>
      <el-radio
        :label="true"
        :disabled="true"
        @change="handleIsSubmitAllChange(true)"
      >
        {{ $t("EXCEL.ExportAll") }}
      </el-radio>
    </el-radio-group>
    <el-upload
      class="upload-area-btn"
      action="/api"
      :multiple="false"
      :file-list="fileList"
      :before-upload="handleExcelAdd"
    >
      <el-button v-show="isValid" class="head-op-btn" type="success">
        {{ $t("EXCEL.UploadExcelFile") }}
      </el-button>
    </el-upload>
    <el-button
      v-show="isValid"
      type="success"
      class="head-op-btn"
      @click="handleDownloadAll"
    >
      {{ $t("EXCEL.ExportLots") }}
    </el-button>
    <el-button
      v-show="isValid"
      type="success"
      class="head-op-btn"
      @click="handleDownloadNeed"
    >
      {{ $t("EXCEL.ExportAddiction") }}
    </el-button>
    <!-- <el-button v-show="isValid" class="head-op-btn" type="success">
        手动添加
      </el-button> -->
    <el-button
      v-show="isValid"
      class="head-op-btn"
      type="warning"
      @click="handleInit"
    >
      {{ $t("COMMON.Reset") }}
    </el-button>
  </header>
</template>

<script>
export default {
  name: "UpdateLangsTools",
  props: {
    isSubmitAll: Boolean,
    fileList: {
      type: Array,
      default: () => [],
    },
    isValid: {
      type: Boolean,
      default: true,
    },
  },
  data() {
    return {
      // 显示提交的数据/原始数据
      isShowSubmit: false,
    };
  },
  watch: {
    isShowSubmit() {
      this.handleIsShowSubmit();
    },
  },
  methods: {
    handleIsSubmitAllChange(value) {
      this.$emit("handleIsSubmitAllChange", value);
    },
    handleExcelAdd(...args) {
      this.$emit("handleExcelAdd", ...args);
    },
    handleInit() {
      this.$emit("handleInit");
    },
    /* 导出所有的数据 */
    handleDownloadAll() {
      this.$emit("handleDownloadAll");
    },
    /* 只导出不完整的数据 */
    handleDownloadNeed() {
      this.$emit("handleDownloadNeed");
    },
    handleIsShowSubmit() {
      this.$emit("handleIsShowSubmit", this.isShowSubmit);
    },
  },
};
</script>

<style scoped lang="scss">
.page-tools-wrapper {
  padding: 0 0 15px 0;
  .head-op-btn,
  .upload-area-btn .head-op-btn {
    margin-left: 5px;
    padding: 5px 10px;
  }
  .upload-area-btn,
  .head-op-btn {
    display: inline-block;
  }
  .submit-type {
    margin-left: 10px;
    padding: 0;
  }
}
</style>
